<template>
	<view>
		<!-- <form @submit="formSubmit"> -->
			<view class="section">
				<input name="account" v-model="pass"  @blur="blurpass" password="true"  maxlength="32"  placeholder="请输入密码" placeholder-style="font-size:26upx" class="password"/>
				<view class="eyesBox">
					<image src="http://rs.eonfox.cc/clzy/static/eyes.png" mode="" class="eyes"></image>
				</view>
			</view>
			<view class="section">
				<input name="password" v-model="pass_twice" password="true" @blur="passVerify"  maxlength="32"  placeholder="请确认密码" placeholder-style="font-size:26upx" class="password"/>
				<view class="eyesBox"  @click="eyes">
					<image src="http://rs.eonfox.cc/clzy/static/eyes.png" mode="" class="eyes"></image>
				</view>
			</view>
			<view class="remind">
				<text class="remindText">密码长度8~24位,必须包含数字/字母/符号至少2种以上元素</text>
			</view>
			<view class="btn-area">
				<button formType="submit" @click="formSubmit()" class="buttons" >确认提交</button>
			</view>
		<!-- </form> -->
	</view>
</template>

<script>
	import eonfox from '@/components/eonfox/eonfox.js';
	var ef = new eonfox();
export default {
	data() {
		return {
			phone: '',
			parentphone: '',
			code: '',
			pass:'',
			pass_twice:'',
			oauthid:''
		};
	},
	onLoad(option) {
		console.log('传值',option)
		this.phone = option.phone;
		this.parentphone = option.parentphone;
		this.code = option.code;
		this.oauthid = option.oauthid
	},
	methods: {
		formSubmit: function() {
			var pass = this.pass;
			var pass_swice = this.pass_twice;
	        var req=[];
			var _this=this
			if (!/[a-zA-Z0-9]{8,24}/.test(pass)) {
				uni.showToast({
					title: '密码为8-24为字符'
				});
				return;
			} 
			if (pass!=pass_swice) {
				uni.showToast({
					title: '两次密码不一样，请确认输入正确'
				});
				return;
			}
			if(this.parentphone==""){//是否填写推荐人
				req = { 
				phone: this.phone,
				 password:pass,
				 confirm_password:pass_swice,
				 phone_verify_key:'sign_up',
				 phone_verify_code: this.code, 	
				 oauth_id:this.oauthid,
				 log_in:true
				  };
				  console.log(pass);
			}else{
				req = { 
			   	 phone:this.phone,
				 password:pass,
				 confirm_password:pass_swice,
				 phone_verify_key:'sign_up',
				 phone_verify_code: this.code, 
				 parent_phone:this.parentphone,
				 oauth_id:this.oauthid,
				log_in:true
				  };
			}
				ef.submit({
					request: {
						s: ['USERSIGNUP',[req]]
					},
					callback: function(data) {
						console.log('回调成功', data);
						
						if(data.data.s.errno) {
							uni.showToast({
								title: data.data.s.error,
								icon: "none"
							});
						} else {
							uni.showToast({
								title: '注册成功',
								success() {
									_this.bind()
									setTimeout(function(){
									uni.reLaunch({
										url:
												'../../pages/me/me'
										});	
									},1000)
								}
							});
							
						}
					},
					error: function(err) {
						console.log('error_:_',err);
						uni.showToast({
							title:'出错啦',
							icon:'none'
						})
					}
				});
			
			
		},
		eyes: function() {
			let pass = document.getElementsByClassName('password');
			console.log(pass.password);
		},
		blurpass:function(event){
			this.pass = event.target.value;
		},
		passVerify:function(event){
			this.pass_twice =  event.target.value;
		},
		//绑定
		bind(){
			var _this=this
			console.log('oauth');
			uni.getStorage({
				key:'oauth',
				success(re) {
					if(re.data){
						_this.bind_()
					}
				}
			})
		},
		bind_(){
			console.log('bind');
			var _this=this
						// #ifdef MP-WEIXIN
						wx.login({
							success(res) {
								wx.getUserInfo({
									success(re) {
										re.code=res.code;
										console.log('re:',re);
										ef.submit({
											request:{s:['USERSELFBINDWEIXIN',['applet',re]]},
											callback(data){
												console.log(data);
												fns.unionid()
												return
											},
											error(err){
												fns.err('err',err)
											}
										})
									}
								})
							}
						})
						// #endif
						// #ifdef APP-PLUS
						console.log('oauto star');
						uni.login({
						  provider: 'weixin',
						  success: function (loginRes) {
							  console.log('loginres:',typeof loginRes);
							  if (loginRes.errMsg=='login:ok') {
										// 获取用户信息
										uni.getUserInfo({
										  provider: 'weixin',
										  success: function (infoRes) {
											  ef.submit({
											  	request:{s:['USERSELFBINDWEIXIN',['app',infoRes.userInfo]]},
											  	callback(data){
											  		console.log(data);
													console.log(JSON.stringify(data));
													fns.unionid()
											  		
											  	},
											  	error(err){
													console.log(err);
											  	}
											  })
											  
											},
										  fail(err){
											  console.log(err);
										  }
										});
							  }else{
								 console.log(err);
							  }
							  
						  },
						  fail(err) {
						  	console.log(err);
						  }
						  
						});
						// #endif
		}
	}
};
</script>

<style scoped lang="stylus" ref="stylesheet/stylus">
	.section
		width 90%
		// height 80upx
		margin 20upx auto
		padding 18upx 0
		background #F2F2F2
		border-radius 10upx
		position relative
		top 5px
		.eyesBox
			position absolute
			right 10upx
			top 5upx
			height 100%
			width 60upx
			
			.eyes
				width 40upx
				height 40upx
				position absolute
				right 10upx
				top 25upx
	.remind
		width 90%
		height 80upx
		margin 20upx auto
		font-size 26upx
		color #A9A9A9
		.remindText
			height 80upx
			line-height 80upx
	.btn-area
		width 90%
		margin 10upx auto
		.buttons
			color #fff
			background #F76968
</style>
